<template>
	<div class="my-star">
		<commonList :data="collectionData" @delete="deleteRelease" :deleteShow="true"></commonList>
		<div v-if="collectionData.length===0" class="no-data">
			<img src="../../assets/image/noData.png" >
			<p>你还没有收藏任何文章，快去收藏吧！</p>
		</div>
	</div>
</template>

<script lang="ts" setup>
	import commonList from '../../component/commonList.vue'
	import {HttpMyCollection,HttpCollection} from '../../public/http'
	import {onMounted,ref} from 'vue'
	import { ElMessage, ElMessageBox } from 'element-plus'
	import {cachLoading} from '../../public/common.ts'
	import bus from '../../public/bus'
	let collectionData = ref([])
	
	// 我的收藏
	const releaseMain = ()=>{
		if(cachLoading('collectionData')){
			collectionData.value = cachLoading('collectionData')
		}
		HttpMyCollection().then((res:any)=>{
			if(res.code === 200){
				cachLoading('collectionData',res.data.acticleDetail)
				collectionData.value = res.data.acticleDetail
			}
		})
	}
	// 取消收藏
	const deleteRelease = (id)=>{
		ElMessageBox.confirm(
			'你确定要删除此收藏嘛？',
			'警告',
			{
			  confirmButtonText: '确定',
			  cancelButtonText: '取消',
			  type: 'warning',
			}
		  ).then(() => {
				HttpCollection(id,{
					status:0
				}).then((res:any)=>{
					if(res.code === 200){
						ElMessage({
						  message: `删除成功`,
						  type: 'success',
						})
						bus.emit("reviseSuccess")
						releaseMain()
						return
					}
					ElMessage({
					  message: `删除失败`,
					  type: 'warning',
					})
				})
		})
		
		
	}
	onMounted(()=>{
		releaseMain()
	})
	
</script>

<style lang="scss">
	.my-star{
		width: 100%;
		height: calc(100%);
		overflow: hidden;
		background: #efedee;
		padding: 10px 10px 0 10px;
		box-sizing: border-box;
		
	}
</style>
